<template>
  <div>
    <div style="margin: 0px 20px 0px 10px">
      <div class="operation-line">
        <div class="search-group">
          <el-input v-model="queryFace.param.personName" placeholder="人员姓名"
                    style="width: 70%;margin-right: 15px"></el-input>
          <el-button type="primary" @click="getAcsFace">搜 索</el-button>
        </div>
      </div>
      <div>
        <el-table
          :data="acsFaceData"
          border
          stripe
          fit="true"
          @selection-change="planSelectionChange"
          style="width: 100%">
          <el-table-column
            type="selection"
            align="center"
            width="55"></el-table-column>

          <el-table-column
            label="序号"
            align="center"
            width="55"
            type="index"></el-table-column>

          <el-table-column label="通道名称" prop="channelName" align="center"/>
          <el-table-column label="通道编码" prop="channelCode" align="center" width="130"/>
          <el-table-column label="部门名称" prop="deptName" align="center"/>
          <el-table-column label="设备编码" prop="deviceCode" align="center"/>
          <el-table-column label="操作类型" prop="operateType" align="center" width="80">
            <template slot-scope="scope">
              {{scope.row.operateType | operateTypeFilter}}
            </template>
          </el-table-column>
          <el-table-column label="人员编码" prop="personCode" align="center"/>
          <el-table-column label="人员姓名" prop="personName" align="center"/>
          <el-table-column label="任务状态" prop="syncFlag" align="center">
            <template slot-scope="scope">
              {{scope.row.syncFlag | syncFlagsFilter}}
            </template>
          </el-table-column>
          <el-table-column label="创建时间" prop="createTime" align="center" width="180"/>
          <el-table-column label="更新时间" prop="updateTime" align="center" width="180"/>
        </el-table>

        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="faceCurrentPage"
          :page-sizes="[5, 10, 20, 50]"
          :page-size="queryFace.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="faceTotalRows"
          style="float: right">
        </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
  import {getChannel, getAcsFaceSyncList} from "@/api/access";

  export default {
    name: "AcsFace",
    data() {
      return {
        channels: [],
        queryData: {
          unitType: 7,
          orgCode: '001'
        },
        pagination: undefined,
        param: "",
        query: {
          param: {
            unitType: 7,
            orgCode: '001'
          },
          pagination: {
            currentPage: 1,
            pageSize: 10
          }
        },
        // 查询人脸授权所需数据
        queryFace: {
          pageNum: 2,
          pageSize: 5,
          param: {
            personName: '',
            personCode: '',
            deptIds: '',
            channelName: '',
            operateType: '',
            syncFlags: ''
          },
        },
        acsFaceData: [],
        facePageSize: undefined,
        faceTotalPage: undefined,
        faceTotalRows: undefined,
        faceCurrentPage: undefined,
      }
    },
    filters: {
      syncFlagsFilter: function (value) {
        switch (value) {
          case '1':
            return "已下发";
          case '2':
            return "下发中";
          case '3':
            return "下发失败";
          case '4':
            return "设备离线";
          case '5':
            return "等待卡片下发成功后自动下发人脸信息";
          case '6':
            return "超时，需重新下发";
          case '7':
            return "下发失败，图片打下超限";
          case '8':
            return "下发失败，用户不存在";
          case '9':
            return "下发失败，图片特征值提取失败";
          case '10':
            return "下发失败，图片数量已超过上限";
        }
      },
      operateTypeFilter: function (value) {
        switch (value) {
          case 1:
            return "增加";
          case 2:
            return "删除";
          case 3:
            return "修改";
        }
      },

    },
    mounted() {
      getChannel(this.query).then(response => {
        console.log(response);
        this.channels = response.data;
        this.param = response.param;
        this.pagination = response.pagination;
      })

      this.getAcsFace();

    },
    methods: {
      getAcsFace() {
        console.log(this.queryFace)
        getAcsFaceSyncList(this.queryFace).then(response => {
          const result = response.data;
          this.acsFaceData = result.pageData;
          this.faceCurrentPage = result.currentPage;
          this.faceTotalPage = result.totalPage;
        })
      },

      search() {
        if (this.queryFace.param.personName !== '') {
          this.acsFaceData = this.acsFaceData.filter(item => {
            return item.personName.indexOf(this.queryFace.param.personName) !== -1;
          })
        }
      }
    }
  }
</script>

<style>

</style>
